<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta http-equiv="pragma" content="no-cache"> 
	    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate"> 
	    <meta http-equiv="expires" content="0">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
	</head>
	
	<style type="text/css">
		* {
			margin: 0px;
			padding: 0px;
		}
		.mui-content {
			width: 100%;
			height: 100%;
			text-align: center;
			background-color: #F3F3F3;
		    -webkit-overflow-scrolling: touch;
		}
		.img-logo {
			width: 122px;
			height: 122px;
			border-radius:61px;
		}
		.div-logo {
			padding-top: 104px;
			margin-bottom: 70px;
		}
		body {
			background: #F3F3F3;
		}
		input {
			width: 50%;
			margin-top: 4px;
			margin-bottom: 0;
			height: 35px; 
			border-width: 0px;
			color:#848383;
			font-size: 15px;
			padding-left: 10px;
			background-color: transparent;	
		}
		.input-bg {
			display: flex;
			height: 39px;
			width: 254px;
			margin:0 auto;
			margin-bottom: 35px;
			border-radius: 19px;
			border-color: red;
			background: #FFFFFF;
			align-items: center;					
		}
		.button-text {
			font-size: 18px;
			color: #FFFFFF;
			font-family: PingFang-SC-Regular;
		}
		label {
			align-self: center;
			color: #848383;
			font-size: 15px;
		}
		.img-icon {
			width: 20px;
			height: 30px;
			margin-left: 10px;
			padding:9px;
		}
		.onclick {
			font-size: 15px;
			border:none;
			margin-left: 15px;
   			background: white;
   			color: #848383;
		}
		.line {
			background: #A6A6A6;
			width: 1px;
			height: 20px;
			margin-left: 10px;
			margin-right: 5px;
		}
		.login-button {
			height: 39px;
			width: 254px;
			font-size: 18px;
			color: #FFFFFF;
			font-family: PingFang-SC-Regular;
			background: url(../img/person/login.png);
			margin: 0 auto;
			background-size: 100% 100%;
			line-height: 39px;
			margin-top: 65px;
			border: none;
		}
		
	</style>
	
	<body>
		<div class="mui-content">
			<div class="div-logo">
				<img  class="img-logo solid" src="../img/person/logo.png"/>
			</div>
			<div class="input-bg">
				<img class="img-icon" src="../img/person/login.png"/>
				<label>+86</label>
				<div class="line"></div>
				<input type="text"/>
			</div>
			<div class="input-bg">
				<button class="onclick">点击获取</button>
				<div class="line"></div>
				<input type="text"/>
			</div>
			<form action="personInfo.html" method="get">
				<button type="submit" id="login_id" class="login-button">
					<span >登  录</span>
				</button>
			</form>		
		</div>
	</body>
	<script type="text/javascript">
		document.getElementById('login_id').addEventListener('click', function() {
			console.log('test1');
		}, false);</script>
</html>
